import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_09_game/base/widget/base_get_builder.dart';
import 'package:flutter_09_game/config/app_color.dart';
import 'package:flutter_09_game/generated/assets.dart';
import 'package:flutter_09_game/generated/locales.g.dart';
import 'package:flutter_09_game/widgets/appbar/common_app_bar.dart';
import 'package:flutter_09_game/widgets/button/common_button.dart';
import 'package:flutter_09_game/widgets/input/common_text_field.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import 'profile_edit_name_logic.dart';

class ProfileEditNamePage extends StatelessWidget {
  ProfileEditNamePage({super.key});

  final ProfileEditNameLogic logic = Get.put(ProfileEditNameLogic());

  @override
  Widget build(BuildContext context) {
    return BaseGetBuilder<ProfileEditNameLogic>(
      backgroundColor: AppColor.pageBgColor,
      appBar: _buildAppBar(),
      builder: (_) {
        return Padding(
          padding: EdgeInsets.symmetric(horizontal: 16.w),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              16.verticalSpaceFromWidth,
              // _buildNameInputSection(),
              CommonTextField(
                textEditingController: logic.nameController,
                hintText: LocaleKeys.pleaseEnterUsername.tr,
                maxLength: 20,
                onChanged: (text) {
                  logic.canSave.value = text.length > 1;
                  // logic.update();
                  logic.nameRx.value = text;
                },
                inputFormatters: [
                  FilteringTextInputFormatter.allow(
                      RegExp(r'[a-zA-Z0-9_]')),
                  LengthLimitingTextInputFormatter(20),
                ],
                rightWidget:Obx(() =>  Text(
                  '${logic.nameRx.value.length}/20',
                  style: TextStyle(
                      color: AppColor.textPrimary.withOpacity(0.3),
                      fontSize: 12.sp),
                )),
              ),
              10.verticalSpaceFromWidth,
              _buildHintText(),
            ],
          ),
        );
      },
    );
  }

  /// 构建应用栏
  PreferredSizeWidget _buildAppBar() {
    return CommonAppBar(
      title: LocaleKeys.editProfile.tr,
      actions: [
        Padding(
          padding: EdgeInsets.only(right: 12.w),
          child: Obx(() => CommonButton(
                title: LocaleKeys.save.tr,
                width: 72.w,
                height: 32.w,
                fontSize: 12.sp,
                fontWeight: FontWeight.w600,
                // textColor: AppColor.profileEditButtonText,
                // backgroundColors: [
                //   AppColor.profileEditButtonBg,
                //   AppColor.profileEditButtonBg
                // ],

                enable: logic.canSave.value,
                onClick: () => logic.saveUserName(),
              )),
        ),
      ],
    );
  }

  // /// 构建用户名输入区域
  // Widget _buildNameInputSection() {
  //   return Container(
  //     padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 14.w),
  //     decoration: BoxDecoration(
  //       color: AppColor.profileEditCardBg,
  //       borderRadius: BorderRadius.circular(12.w),
  //       border: Border.all(
  //         color: AppColor.profileEditBorder,
  //         width: 1.w,
  //       ),
  //     ),
  //     child: Row(
  //       children: [
  //         // 输入框
  //         Expanded(
  //           child: TextField(
  //             controller: logic.nameController,
  //             style: TextStyle(
  //               fontSize: 14.sp,
  //               fontWeight: FontWeight.w600,
  //               // color: AppColor.profileEditTextPrimary,
  //             ),
  //             decoration: InputDecoration(
  //               border: InputBorder.none,
  //               enabledBorder: InputBorder.none,
  //               focusedBorder: InputBorder.none,
  //               hintText: LocaleKeys.pleaseEnterUsername.tr,
  //               // hintStyle: TextStyle(
  //               //   fontSize: 14.sp,
  //               //   fontWeight: FontWeight.w400,
  //               //   color: AppColor.profileEditTextHint,
  //               // ),
  //               contentPadding: EdgeInsets.zero,
  //               isDense: true,
  //             ),
  //             maxLength: ProfileEditNameLogic.maxLength,
  //             buildCounter: (context,
  //                     {required currentLength,
  //                     required isFocused,
  //                     maxLength}) =>
  //                 null,
  //           ),
  //         ),
  //         16.horizontalSpace,
  //         // 字符计数
  //         Obx(() => Text(
  //               logic.characterCountText,
  //               style: TextStyle(
  //                 fontSize: 12.sp,
  //                 fontWeight: FontWeight.w400,
  //                 color: AppColor.profileEditTextHint,
  //               ),
  //             )),
  //       ],
  //     ),
  //   );
  // }

  /// 构建提示文本
  Widget _buildHintText() {
    return Text(
     LocaleKeys.nicknameRule.tr ,
      style: TextStyle(
        fontSize: 12.sp,
        fontWeight: FontWeight.w600,
        color: AppColor.primary,
        height: 1.55,
      ),
    );
  }
}
